<template>
  <div>
    <v-card>
      <v-row max-width="260" class="mb-0">
        <v-spacer />
        <v-img
          :src="require('@/assets/logo.png')"
          contain
          height="48"
          width="48"
          max-width="48"
        />
        <v-spacer />
      </v-row>
      <v-row max-width="260" class="mt-0">
        <v-spacer />
        <p>admin</p>
        <v-spacer />
      </v-row>
      <v-divider></v-divider>
      <v-row max-width="260">
          <v-btn class="my-4" color="pink" text width="80%">
            <v-icon>mdi-heart</v-icon>
            我的关注
          </v-btn>
      </v-row>
      <v-row max-width="260">
          <v-btn class="mb-2" color="indigo" text width="80%">
            <v-icon>mdi-star</v-icon>
            我的收藏
          </v-btn>
      </v-row>
      <v-row max-width="260">
        <v-btn class="ml-2 mt-2" @click="openUserPage" text width="90%">个人中心<v-spacer /></v-btn>
      </v-row>
      <v-row max-width="260">
        <v-btn class="ml-2 my-4" @click="logout" text width="90%">退出登录<v-spacer /></v-btn>
      </v-row>
    </v-card>
  </div>
</template>

<script>
export default {
  props: {
  },
  methods: {
    async logout() {
      await this.$auth.logout()
    },
    openUserPage () {
      this.$router.push('/user')
    },
  },
}
</script>

<style></style>
